fix(web): sit the New Project button properly beside its title - #14169
Open
raunakab wants to merge 1 commit into
Open
fix(web): sit the New Project button properly beside its title#14169raunakab wants to merge 1 commit into
raunakab wants to merge 1 commit into
Conversation
The button was a size smaller than the row it shares with the "Projects" title, so it read as an afterthought rather than that section's action. Spacing moves with it: the section header carries its own top padding and right inset now, and the title its own vertical padding, instead of the gaps being spread across the sidebar body and header.
Contributor
|
Full-stack Preview (frontend + backend)
Sign in with GitHub as an |
Contributor
Greptile SummaryThe PR enlarges the sidebar’s New Project action and relocates vertical spacing from shared header/body containers into section headers and titles.
Confidence Score: 4/5The PR should not merge until shared body spacing is preserved for sidebar consumers that do not receive the new section-header padding. Removing the shared body gap makes AdminSidebar’s explicit spacer inert and drops spacing around raw SidebarLayouts.Body children. Files Needing Attention: web/lib/opal/src/layouts/sidebar/styles.css Important Files Changed
Prompt To Fix All With AI### Issue 1
web/lib/opal/src/layouts/sidebar/styles.css:155
**Body gap removal collapses spacing**
When `SidebarLayouts.Body` contains non-section children, removing `gap-2` provides no replacement spacing, causing AdminSidebar's explicit gap-based spacer to become inert and raw CreateConnectorSidebar children to lose their half-rem separation.
---
For each issue above, determine whether it is valid and should be fixed. If so, fix it directly.Reviews (1): Last reviewed commit: "fix(web): sit the New Project button pro..." | Re-trigger Greptile |
![greptile-apps[bot]](https://avatars.githubusercontent.com/in/867647?s=60&v=4){kind=small}
![cubic-dev-ai[bot]](https://avatars.githubusercontent.com/in/1082092?s=60&v=4){kind=small}
Contributor
There was a problem hiding this comment.
All reported issues were addressed across 2 files
Reply with feedback, questions, or to request a fix.
Re-trigger cubic
Contributor
|
Preview Deployment
|
Contributor
🖼️ Visual Regression Report
|
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Description
The "New Project" button beside the sidebar's "Projects" title was a size smaller than the row it shares, so it read as an afterthought rather than that section's action. It is now
size="md", matching the title row.Spacing moves with it. The section header owns its own top padding and right inset, and the title its own vertical padding, rather than the gaps being spread across
.opal-sidebar-headerand.opal-sidebar-body__content. Net effect is the same rhythm between sections, with the header row sized around its own contents.Note that
.opal-sidebar-section__headerand__titleare shared by everySidebarLayouts.Section, so Recents and Projects both shift.Screenshots + Videos
Before
("Close Sidebar" button and "New Project" button are out-of-alignment.)
After
("Close Sidebar" button and "New Project" button are now in full alignment.)
Additional Options
Summary by cubic
Aligns the New Project button with the Projects header row to match visual hierarchy. Previously the button was size "sm" and looked smaller; now it’s "md", with spacing shifted to the section header/title so the row sizes around its contents. Shared header/title styles mean Recents also adopts the new spacing, while overall section rhythm stays the same.
Review notes
Written for commit fd50241. Summary will update on new commits.